<template>
  <footer class="clearfix"   style="position:relative" >
    <div class="footer">
      <div class="wrap">
        <div class="logo" style="position: relative">
          <div class="border">
            <div class="imgBoxs" style="position: relative"><img :src="ios">
              <p class="wx">蓝湾物流公众号</p>
            </div>
          </div>
          <div style="position:absolute; height: 80px; right:0px;top: 20%; border-right: 1px solid #ccc"></div>
        </div>
        <div class="nave" style="position: relative">
          <div class="border">
            <p class="text">
              中国新兴的物流服务平台, 覆盖全球多个国家和地区
              <!--<span> 中国领先的物流服务平台 <br/> 覆盖全球</span><i>200</i> <span>多个国家和地区<i>100,000,000</i></span><span>位使用者<i>920,000</i>家国际站点中国物流行业的领导者！</span>-->
            </p>
          </div>
          <div style="position:absolute; height: 80px; right:0px;top: 20%; border-right: 1px solid #ccc"></div>
        </div>
        <div class="us">
          <div class="border" style="border-right: 0px none">
            <p class="taitl" >联系我们</p>
            <p class="taitl">
             <span class=""><img :src="icon_phone" style="width: .45rem" /> </span> <span class="red top">0755-2398 7252</span>
            </p>
            <p >
              <span class="taitl" ><img :src="icon_email" style="width: .45rem"/></span> <span class="top" style="font-size: .18rem; "> service@lanwantech.cn</span>
            </p>
          </div>
        </div>
        <div class="cleae">
          <p class="copyright">copyright2017©lanwantech.cn</p>
        </div>
      </div>
    </div>
  </footer>
</template>
<style scoped>
  /*基础 中文样式*/
  .copyright{color: #999;font-size: .16rem;padding-top:30px;width: 90%;padding-bottom: 10px}
  p{font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;color: #333}
  .logo{float: left;width:30%;cursor: pointer;}
  .nave{float: left;width:37%;}
  .us{float: right;width:33%;}
   .us .taitl{font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;}
   .top{position: relative;top: -.15rem;left: .1rem;font-weight: 400;}
   footer{background: #f7f7f7;height: auto;padding: .5rem 0px .2rem 0px;font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;font-size: .14rem}
   .footer{width:90%;max-width: 1200px;margin: auto}
   .nave p{ line-height: .4rem;font-size: .18rem;width: 80%;margin: auto;}
   .us p{padding-bottom: .2rem; font-family: Regular}
   .iocnImg{width: .35rem; position: relative; top: .1rem; left: .02rem;}
   .iocn{padding: .06rem .03rem .06rem .03rem; border-radius:20px;font-size: .24rem;background-color: #3493d1;margin-right: .2rem }
  .imgBoxs{ width: 1.25rem; height: 1.25rem; border: 1px solid #f1f1f1;margin: auto;float: right; min-width:84px;min-height:84px ;margin-right: 60px}
  .imgBoxs img{max-width: 100%; }
  .red{ color: #333;font-size: .24rem;font-weight: bold}
  .wrap{width: 100%;min-width: 1100px;max-width: 1700px;margin: auto}
 .border{width: 75%;height:1.6rem;border-right: 1px solid #f1f1f1;padding: 12.5% ;padding-top: 0px; padding-bottom: 0px;font-size:.16rem;text-align: left;color: #333;line-height: .3rem;}
 i{ color: #333;padding: 0px .09rem;font-size: .26rem;font-weight: bold;font-style:normal}
  /**英文样式覆盖**/
  .English .EnglishLogoText{ font-size: 14px;text-indent: 10px}
  .English  .navBox{ width: auto; margin-left: 30px;}
  .English  .red{ left: 30px;width: 120px}
  .English .transport .red{ left: 30px;width: 98px}
  .English .histroy .red{ left: 158px;width: 80px}
  .English .create .red{ left: 267px;width: 212px}
  .English .chart   .red {left: 20px;display: block}
  .English .Histroy   .red {left: 140px;display: block}
  .English .creatOder   .red {left: 250px;width: 250px;display: block}
  .code {width: 100px; height: 100px;border: 1px solid #e1e1e1;}
  .code img {max-width:100%}
  .wx{width: 1.2rem;min-width: 100px; position: absolute;bottom: -.4rem;text-align: center;font-size: .16rem;font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif}
  .nave .text{ margin-top: 15%}
  @media only screen and (min-width: 1200px){
    p{font-size: 14px}
    .nave p{ line-height: 25px;font-size: 14px}
    .border{height: 1.9rem}
    .wx{ font-size: 14px;left: -8px;bottom: -35px}

  }
  @media only screen and (min-width: 1400px){
    p{font-size: 15px}
    .nave  p{line-height: 25px;font-size: 15px}
    .border{height: 1.6rem}
    .wx{ font-size: 14px;left: 0px;bottom: -35px}

  }
  @media only screen and (min-width: 1600px){
    p{font-size: 16px}
    .nave  p{line-height: 25px;font-size: 16px}

  }
  @media only screen and (min-width: 1920px){
    p{font-size: 16px}
    .nave  p{line-height: 30px;font-size: 16px}
    .wx{ font-size: 16px}

  }

</style>
<script>
  import { mapState, mapActions } from 'vuex'
  import Public from '../../vuex/public.js'
  import icon_phone from '../../../static/img/icon_phone.png'
  import icon_email from '../../../static/img/icon_email.png'
  import phoneIdex from '../../../static/img/phoneIdex.png'
  import ios from '../../../static/img/wx.jpg'
  export default {
    name: 'my-header',
    created () {
     // 查看本页面路由 绑定对应页面class
      this.check = this.$route.name;
      var usr = sessionStorage.getItem('user');
      if(usr) {
        usr = JSON.parse(usr);
        if(usr.type == 0){
         // this.$router.push({ name: 'AdminConfig' })
        }
      }else {
        if(this.check != 'login'){
            // this.$router.push({ name: 'AdminConfig' })
        }
      }
    },
    data () {
      return {
        activeIndex: '1',
        activeIndex2: '1',
        ios:ios,
        phoneIdex:phoneIdex,
        icon_phone:icon_phone,
        icon_email:icon_email,
      }
    },
    methods: {
      ...mapActions({
        lognOutPost: 'loginOutFn'
      }),
      handleSelect(key, keyPath) {
      },

      goPage (name) {
          this.$router.push({name: name})

      },
      //  语言切换
      languageCheng (parm) {
        this.show = !this.show
        if (parm) {
          Public.publicLo.sessionStorageSav('Language',parm)
          this.$store.commit('updateLanguage', parm)
        }
      },
      //
      goAdmin(){
          var test = window.location.href
          this.$router.push({ name: 'adminDavise' })
          //window.open('/adminDavise','_self')
      },
      // 退出
      loginOut (id) {
        var parm = ''
        this.lognOutPost(parm)
      },
      openSuccess (text) {
        this.$message({
          message: text,
          type: 'success'
        })
      },
      openError (text) {
        this.$message.error(text)
      }
    },
    computed: {
      languageData: function () {
        var parm = this.language;
        if (parm) {
            if (parm.check == 'Chinese') {
              parm = parm.Chinese;
            }
            if(parm.check == 'English') {
              parm = parm.English;
            }
        }
        return parm
      },
     updateStatusData: function () {
       var parm = this.updateStatus;
       if (parm == 'out') {
         // 没记住密码保存空 localStorage
         Public.publicLo.sessionStorageSav('token', '');
         Public.publicLo.sessionStorageSav('user', '');
         // 清空所有数据
         this.$store.commit('loginOut', null);
         this.$router.push({ name: 'login' });
         // this.lognOutPost(this.user)
       }
       if (parm == 'outErorr') {
         Public.publicLo.sessionStorageSav('token', '');
         Public.publicLo.sessionStorageSav('user', '');
         // 清空所有数据
         this.$store.commit('loginOut', null);
         this.$router.push({ name: 'login' })
       }
       return 1
     },
      ...mapState([
        'nav',
        'language',
        'updateStatus'
      ])
    },
    mounted () {

    }
  }
</script>

